import router from '@/router'
import store from '@/store'

// 前置导航守卫
router.beforeEach(async(to, from, next) => {
  const token = store.getters.token
  const url = to.path
  const whiteList = ['/login', '/404', '/test']
  // 1. 已登录去登录页 -> 跳转到首页
  if (token && url === '/login') {
    next('/')
  }
  // 2. 已登录不去登录页 -> 放行
  if (token && url !== '/login') {
    // 如果用户已经获取了数据就直接放行 防止每刷新一次页面就请求一次数据
    if (!store.state.user.userInfo.userId) {
      // 调用 actions 发起获取用户数据请求
      await store.dispatch('user/getUserInfo')
      // 登陆后拿取用户数据
      // 调用 actions 进行筛选
      const routes = await store.dispatch('permission/filterRoutes', store.getters.menus)
      // 拿到筛选好的结果 使用 addRoutes 方法追加路由配置
      router.addRoutes([
        ...routes,
        // 404 page must be placed at the end !!!
        // 将404页面放到加载动态路由之后,解决动态路由页面刷新跳转到404
        { path: '*', redirect: '/404', hidden: true }
      ])
      // 由于追加路由比匹配路径触发晚,
      // 需要重新跳转到当前的路径, 多触发一遍匹配
      next(to.path)
    } else {
      next()
    }
  }
  // 3. 未登录在白名单 -> 放行
  if (!token && whiteList.indexOf(url) !== -1) {
    next()
  }
  // 4. 未登录不在白名单 -> 跳转到登录页
  if (!token && whiteList.indexOf(url) === -1) {
    next('/login')
  }

  // if (store.getters.token) {
  //   // 1.已登录
  //   // 1.1 如果去登录页,跳转到首页
  //   if (to.path === '/login') {
  //     next('/')
  //   } else {
  //     // 1.2 其他页面放行
  //     // 这里就是保证了有token 而且是正常放行的后台页面
  //     // 这里可以开始获取用户资料
  //     // 这里是为了保证所有页面都有数据, 如果数据已存在,就不用重复获取
  //     if (!store.state.user.userInfo.userId) {
  //       // 调用 actions 发起获取用户数据请求
  //       await store.dispatch('user/getUserInfo')
  //     }
  //     next()
  //   }
  // } else {
  //   // 2.未登录
  //   const whiteList = ['/login', '/404', '/test']
  //   // 2.1 如果当前页面不需要登录, 直接方放行
  //   if (whiteList.indexOf(to.path) !== -1) {
  //     next()
  //   } else {
  //     // 2.2 如果当前页面需要登录, 跳转到登录页
  //     next('/login')
  //   }
  // }
})
